import { useEffect, useState } from "react";
import HomePage_TableComponent from "../../../../../../components/table";
import { $Http } from "../../../../../../network";
import { $eventBus } from "../../../../../../common/utils";

// 主页-数据管理页面-站点台账页面
const HomePage_DataManagementPage_SiteAccountPage: React.FC = () => {

    const columnList = [
        {
            title: '序号',
            dataIndex: 'idx',
            render: (text: string, record: object, idx: number) => `${idx + 1}`,
        },
        {
            title: '站点名称',
            dataIndex: 'monitor_pointer',
        },
        {
            title: '线路',
            dataIndex: 'line_name',
        },
        {
            title: '电压等级',
            dataIndex: 'vol_level',
            render: (text: string) => `${text} kV`,
        },
        {
            title: '容量',
            dataIndex: 'disk_left',
            render: (text: string) => `${text} MVA`,
        },
        {
            title: '经度',
            dataIndex: 'longitude',
        },
        {
            title: '纬度',
            dataIndex: 'latitude',
        },
        {
            title: '通信状态',
            dataIndex: 'status',
            render: (text: string) => <div style={{ color: text === "在线" ? "#2BEDE6" : "#7A8F99" }}>{text}</div>,
        },
    ]
    let [sourceData, setSourceData] = useState<object>({})
    let [pageNo, setPageNo] = useState<number>(1)
    let [pageSize, setPageSize] = useState<number>(17)
    let searchData = {}
    const http_paramstatics = () => {
        $Http("paramstatics", Object.assign({ pageNo, pageSize },searchData)).then((res) => {
            sourceData = res
            setSourceData({ ...sourceData })
        })
    }
    const get_pagination = (page: number, pageSize: number) => {
        pageNo = page
        pageSize = pageSize
        setPageNo(pageNo)
        setPageSize(pageSize)
        http_paramstatics()

    }
    const eventBus_on = () => {
        // 查询条件
        $eventBus.addListener("eventBus_tableSearchConditionData", (res) => {
            searchData=res
            http_paramstatics()
        })
    }
    const eventBus_off = () => {
        // 查询条件
        $eventBus.removeAllListeners("eventBus_tableSearchConditionData")
    }
    useEffect(() => {
        eventBus_on()
        return () => {
            eventBus_off()
        }
    }, [])
    return (
        <div>
            <HomePage_TableComponent columnList={columnList} sourceData={sourceData} get_pagination={get_pagination} />
        </div>
    )
}

export default HomePage_DataManagementPage_SiteAccountPage